<!-------- DOCUMENT ADMIN -------->
<cfscript>
	settingTypes = "DSMCodes,dosageUnits,frequencyUnits,routeMethods,racialEthnicities";
	tmp = "";
	if(flashKeyExists("admin")) {
		tmp = flashMessages(key="admin", class="alert-message success");
		flashClear();
	}
</cfscript>
<cfoutput>#tmp#
	<div id="documentSettings">
		<form id="Documents" action="#URLFor(controller='document', action='updateDocumentItem')#">
			<!--------------------------------------------------------------------- 	Accordion Container ~ START --->
			<div class="accordion" id="settingsAccordion" style="width: 65%; margin: 0 auto;">
				<!------------------------------------------------------------------ 	Accordion Groups ~ START --->			
				<cfloop list="#settingTypes#" index="settingType">
	            	<div class="accordion-group">
						<!--- Accordion Buttons --->
	              		<div class="accordion-heading">
	                		<span class="accordion-toggle btn btn-success" data-toggle="collapse" data-parent="##settingsAccordion" data-target="###settingType#Content">
	                  			<i class="icon-chevron-right icon-white"></i>#humanize(settingType)#
	               			</span>
	              		</div>
						<!------------------------------------------------------------	Accordion Content ~ START --->
						<div id="#settingType#Content" class="accordion-body collapse">
	                		<div class="accordion-inner">
		                		<table id="#settingType#Table" class="forms" align="center" cellpadding="6">
									<thead>
										<tr>
											<cfloop list="#documents[settingType].columns#" index="columnName">
												<th class="title"><cfif columnName IS "id">&nbsp;<cfelse>#humanize(columnName)#</cfif></th>
											</cfloop>
											<th class="transparent">
												<div class="btn-group">
													<a class="btn btn-info btn-single addButton" title="Add Item" item-type="###settingType#">
														<i class="icon-plus icon-white"></i>
													</a>
												</div>
											</th>
										</tr>
									</thead>
									<tbody>
										<tr class="hidden" id="#settingType#Tr">
											<cfloop list="#documents[settingType].columns#" index="columnName">
												<td align="left">											
													<cfif columnName IS "id">
														&nbsp;
													<cfelseif ListFindNoCase("category", columnName)>
														<cfset categories = model("axisCodes").findAll(select="category", group="category")>
														<select id="[updateType]]-#documents[settingType].table#-[intRow]-#columnName#" name="[updateType][axisCodes][[intRow]][category]" class="validate[required]">
															<option value="">-- Please Select Category --</option>
															<cfloop query="categories">
																<option value="#categories.category#">#categories.category#</option>
															</cfloop>
														</select>
													<cfelse>
														#textFieldTag(name="[updateType][#documents[settingType].table#][[intRow]][#columnName#]", id="[updateType]-#documents[settingType].table#-[intRow]-#columnName#", style="postion:relative;width:70%;", class="validate[required]", value="")#
													</cfif>
												</td>
											</cfloop>
											<td class="transparent">
												<a class="btn btn-danger btn-single deleteButton" onClick="$(this).parent().parent().remove();" title="Delete Item">
													<i class="icon-trash icon-white"></i>
												</a>
											</td>
										</tr>
										<cfset qrySetting = documents[settingType].query>
										<cfloop query="qrySetting">
											<tr class="row#currentRow MOD 2#">
												<cfloop list="#documents[settingType].columns#" index="columnName">
													<cfif columnName IS "id">
														<td class="center">#currentRow#</td>
													<cfelse>
														<td class="left">#qrySetting[columnName][currentRow]#</td>
													</cfif>
												</cfloop>
												<td class="transparent">
													<a class="btn btn-danger btn-single deleteButton" onClick="deleteItem($(this));" delete-url="#URLFor(controller='document', action='deleteDocumentItem', key=id)#?table=#documents[settingType].table#" title="Delete Item">
														<i class="icon-trash icon-white"></i>
													</a>
												</td>
											</tr>
										</cfloop>
									</tbody>
								</table>
	                  		</div>	                  		
	              		</div>
	              		<!-------------------------------------------------------------		Accordion Content ~ END --->
					</div>
				</cfloop>
				<!-------------------------------------------------------------------		Accordion Groups ~ END --->
			</div>
			<!---------------------------------------------------------------------- 		Accordion Container ~ END --->
		</form>
	</div>
</cfoutput>
<script type="text/javascript">
	var intAdd = 0;
	jQuery.fx.interval = 3000;
	
	//---> Data Validation with jQuery.ValidationEngine
	$('form').validationEngine({
		promptPosition: "bottomLeft"
	});

	//---> Expand/Collapse Icon and State Changes
	$('.collapse').on('show', function () {
			$(this).prev().find('.btn').addClass('active')
				.find('i').removeClass('icon-chevron-right').addClass('icon-chevron-down');
		}).on('hide', function() {
			$('.active').removeClass('active');
			$('.icon-chevron-down').removeClass('icon-chevron-down').addClass('icon-chevron-right');
		});
		
	//---> Adding Document Items
	$('.addButton').on('click', function() {
		var $itemType = $(this).attr("item-type");
		var $tr = $($itemType + "Tr").clone().removeClass("hidden");
		var $table = $($itemType + "Table").find('tbody');
		
		intAdd++;
		
		$tr.find('select, input').each(function() {
			var id = $(this).attr('id').replace(/\[intRow\]/g, intAdd).replace(/\[updateType\]/g, "insert");
			var name = $(this).attr('name').replace(/\[intRow\]/g, intAdd).replace(/\[updateType\]/g, "insert");
			
			$(this).attr('name', name).attr('id', id);
		});

		$table.prepend($tr);
		$($itemType + "Content").collapse('hide').collapse('show');
	});
	
	//---> Deleting Document Items
	function deleteItem($this) {
		intAdd--;
		$this.parent().parent().remove();	
		$dialog.dialog("close");

		$(".tipsy-w").remove();

		if($(this).attr('delete-url') != "") {
			$.ajax({
				url: $this.attr('delete-url'),
				complete: function() {
					$('#documentButton').click();
					
				}
			});	
		}
	}
</script>